<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>任务详情</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet" type="text/css" th:href="@{/js/layui/css/layui.css}" media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/cba/style.css/}" media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/cba/my.css/}" media="all">
</head>
<body class="childrenBody">
<form class="layui-form html_save" lay-filter="form">
    <div class="layui-form-item">
        <label class="layui-form-label">任务标题</label>
        <div class="layui-input-block">
            <p style="line-height: 40px;color: grey" th:text="${mission.title}"></p>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">审核方式</label>
        <div class="layui-input-block">
            <p th:if="${mission.checkType==0}" style="line-height: 40px;color: grey">自动审核</p>
            <p th:if="${mission.checkType==1}" style="line-height: 40px;color: grey">人工审核</p>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">单价/总数</label>
            <div class="layui-input-inline">
                <p style="line-height: 40px;color: grey" th:text="${mission.price+'/'+mission.num}"></p>

            </div>

        </div>
        <div class="layui-inline">
            <label class="layui-form-label">审核/完成</label>
            <div class="layui-input-inline">
                <p style="line-height: 40px;color: grey" th:text="${mission.checkNum+'/'+mission.completeNum}"></p>
            </div>

        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">任务内容</label>
        <div class="layui-input-block">
            <p style="line-height: 40px;color: grey" th:text="${mission.memo}"></p>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">图标</label>
        <div class="layui-input-block">
            <img style="width: 100px;height: 80px;" th:src="${mission.mainPic}"/>
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">附图</label>
        <div class="layui-input-block">
            <img th:each="c:${#strings.listSplit(mission.imgs,',')}" th:src="${c}"
                 style="width: 100px;height: 80px;margin-right: 5px;"/>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">任务状态</label>
            <div class="layui-input-inline">
                <p th:if="${mission.status==0}" style="line-height: 40px;color: grey">已发布</p>
                <p th:if="${mission.status==1}" style="line-height: 40px;color: grey">已完成</p>
                <p th:if="${mission.status==2}" style="line-height: 40px;color: grey">已终止</p>

            </div>

        </div>
        <div class="layui-inline">
            <label class="layui-form-label">审核状态</label>
            <div class="layui-input-inline">
                <p th:if="${mission.checkStatus==0}" style="line-height: 40px;color: grey">待审核</p>
                <p th:if="${mission.checkStatus==1}" style="line-height: 40px;color: grey">通过</p>
                <p th:if="${mission.checkStatus==2}" style="line-height: 40px;color: grey">拒绝</p>

            </div>
        </div>
    </div>


    <div class="layui-form-item" th:if="${mission.checkStatus==2}">
        <label class="layui-form-label">拒绝原因</label>
        <div class="layui-input-block">
            <p style="line-height: 40px;color: grey" th:text="${mission.refuseReason}"></p>
        </div>
    </div>


    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">创建时间</label>
            <div class="layui-input-inline">
                <p style="line-height: 40px;color: grey"
                   th:text="${#dates.format(mission.ctime,'yyyy-MM-dd HH:mm:ss')}"></p>

            </div>

        </div>
        <div class="layui-inline">
            <label class="layui-form-label">发布时间</label>
            <div class="layui-input-inline">
                <p th:if="${!#strings.isEmpty(mission.publishTime)}" style="line-height: 40px;color: grey"
                   th:text="${#dates.format(mission.publishTime,'yyyy-MM-dd HH:mm:ss')}"></p>
            </div>

        </div>
    </div>


    <div class="layui-form-item">
        <div class="layui-input-block" th:if="${mission.checkStatus==0}">
            <button class="layui-btn" type="button" id="check">审核</button>


        </div>
    </div>
</form>
<script th:src="@{/js/layui/layui.js}"></script>
<script th:src="@{/js/cba/login-timeout.js}"></script>
<!--<script type="text/javascript" src="js/newsadd.js"></script>-->

<script type="text/javascript" th:inline="javascript">
    layui.use(['table', 'form', "layer"], function () {

        // 操作对象
        var form = layui.form
            , table = layui.table
            , layer = layui.layer
            , $ = layui.jquery;

        var menu = [[${menu}]];
        if (menu != null) {
            form.val("form", {
                "name": menu.name // "name": "value"
                , "path": menu.path
                , "icon": menu.icon
                , "sort": menu.sort
                , "memo": menu.memo
                , "id": menu.id
            });

            $("#pid").val(menu.pid);
            form.render("select", null); //刷新select选择框渲染

            if (menu.status == 1) {
                $("#status").removeAttr("checked");
            }
            form.render("checkbox"); //刷新select选择框渲染

        }


        //监听提交
        $('#check').click(function () {

            layer.confirm("请选择审核状态", {
                icon: 3,
                btn: ['通过', '拒绝'],
                title: '提示'
            }, function (index) {
                $.ajax({
                    type: "post",
                    url: [[${basePath}]] + "/mission/check",
                    data: {id: [[${mission.id}]], status: 1},
                    success: function (res) {
                        if (res.success) {
                            layer.msg("操作完成", {icon: 1});
                            setTimeout(function () {
                                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                parent.document.getElementById("search").onclick()
                                parent.layer.close(index);

                            }, 1500);
                            layer.close(index);


                        }
                    }
                });


            }, function (index) {
                layer.prompt({title: '请输入拒绝理由', formType: 2}, function (pass, index) {
                    $.ajax({
                        type: "post",
                        url: [[${basePath}]] + "/mission/check",
                        data: {id: [[${mission.id}]], status: 2, reason: pass},
                        success: function (res) {
                            if (res.success) {
                                layer.msg("操作完成", {icon: 1});
                                setTimeout(function () {
                                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                                    //parent.location.href = [[${basePath}]] + "/product/claim/index";
                                    parent.layer.close(index);
                                    parent.document.getElementById("search").onclick()
                                }, 1500);
                                layer.close(index);

                            }
                        }
                    });

                });

            });

        });

    });
</script>
</body>
</html>